<template>
    <div>
        <div width="200">
            <el-input
                :style="{width:'500px'}"
                type="textarea"
                :autosize="{ minRows: 4}"
                placeholder="请输入内容"
                v-model="textarea">
            </el-input>
            <el-button type="primary" @click="submitCheckText()">提交</el-button>
            <el-button @click="resetForm()">重置</el-button>
        </div>
        <div :style="{marginTop: '100px'}">
            <div>结果如下</div>
            <hr>
            <div>
                <el-button v-for="(item,key,index) in wordsLis" :key="index">
                    {{key}}
                </el-button>
            </div>
        </div>
    </div>
</template>
<script>
import { checkSensitive } from "@/config/api";
import { Loading } from 'element-ui';
export default {
    data () {
        return {
            textarea: '',
            wordsLis: []
        }
    },
    mounted () {

    },
    methods: {
        async submitCheckText () {
            const loadingInstance1 = Loading.service({ fullscreen: true });
            const res = await checkSensitive(this.textarea);
            if (res.status === 200) {
                loadingInstance1.close();
                this.wordsLis = res.data;
                this.$notify({
                    title: '成功',
                    message: '校验请求成功',
                    type: 'success'
                });
            } else{
                loadingInstance1.close();
                this.$notify({
                    title: '失败',
                    message: '校验请求失败',
                    type: 'error'
                });
            }
        },
        resetForm () {
            this.textarea = '';
            this.wordsLis = [];
        }
    }
}
</script>